<template>
  <div class="detail-wrapper">
    <tag tag="图文详情" />
    <div class="text" v-html="detail.inText" v-if="detail.inText"></div>
    <ul class="img" v-if="detail.inImages && detail.inImages.length > 0">
      <li
        v-for="(item, index) in detail.inImages"
        :key="index"
      >
        <div class="image">
          <img v-lazy="item" />
        </div>
      </li>
    </ul>
  </div>
</template>

<script>
import Tag from './Tag'
export default {
  name: 'DetailInfo',
  props: {
    detail: {
      type: Object,
      default() {
        return {}
      }
    }
  },
  components: { Tag }
}
</script>

<style scoped lang="stylus">
.detail-wrapper
  margin 10px
  padding 10px
  background white
  border-radius 10px
  text-align left
  .text
    text-align left
    line-height 1.2em
    margin 10px 0
  .content
    margin-top 5px
    min-height 60px
    ::v-deep
      img
        width 100%
</style>
